// 源插件
import React, { PureComponent, Fragment } from 'react';
import { connect } from 'dva';
import moment from 'moment';
import router from 'umi/router';

// 视图插件
import {
  Spin,
  Row,
  Col,
  Card,
  Form,
  Input,
  Select,
  Icon,
  Button,
  Dropdown,
  Menu,
  InputNumber,
  DatePicker,
  Modal,
  message,
  Badge,
  Divider,
  Steps,
  Radio,
  Upload,
} from 'antd';

// 外部组件
import StandardTable from '@/components/StandardTable';
import PageHeaderWrapper from '@/components/PageHeaderWrapper';

// css OR less预编译器

// 图片

const FormItem = Form.Item;

/**
 *  Created by xjc on 2019/8/15
 *  Describe:数据连接
 */

@connect(({ authority, loading }) => ({
  authority,
  loading: loading.models.AuthorityRule,
}))
@Form.create()
class MenuAdd extends PureComponent {
  componentWillMount() {}

  /**
   *  Created by xjc on 2019/8/15
   *  Describe:当前状态
   */

  state = {};

  onChange = e => {};

  okHandle() {
    this.props.form.validateFields((err, values) => {
      if (!err) {
        const { dispatch } = this.props;
        dispatch({
          type: 'authority/AddMenuList',
          payload: {
            parentId: values.parentId,
            name: values.permissionname,
            permission: values.permission,
            type: values.type,
            url: values.url,
          },
          callback: res => {
            if (res.code === 1) {
              message.success(res.message);
              this.props.closeMenuAdd();
            } else {
              message.warning(res.message);
            }
          },
        });
      }
    });
  }

  cancelHandle() {
    this.props.closeMenuAdd();
  }

  render() {
    const {} = this.state;
    const { form, EditORExamine, permissions } = this.props;
    const { getFieldDecorator } = form;

    let readOnlyORNot = true;
    if (EditORExamine === 'Edit') {
      readOnlyORNot = false;
    }

    const children = [];
    children.push(<Option key="0">最高级</Option>);
    for (let i = 0; i < permissions.length; i++) {
      children.push(<Option key={permissions[i].id}>{permissions[i].permissionname}</Option>);
    }

    return (
      <Modal
        destroyOnClose
        title="角色添加"
        visible
        centered
        onOk={this.okHandle.bind(this)}
        onCancel={this.cancelHandle.bind(this)}
      >
        <Form onSubmit={this.handleSearch} style={{ overflowY: 'scroll' }}>
          <FormItem label="父级ID" labelCol={{ span: 8 }} wrapperCol={{ span: 15 }}>
            {getFieldDecorator('parentId', { initialValue: '' })(
              <Select style={{ width: '85%' }}>{children}</Select>
            )}
          </FormItem>

          <FormItem label="菜单标识" labelCol={{ span: 8 }} wrapperCol={{ span: 15 }}>
            {getFieldDecorator('permission', { initialValue: '' })(
              <Input readOnly={readOnlyORNot} style={{ width: '85%' }} placeholder="菜单标识" />
            )}
          </FormItem>

          <FormItem label="菜单名称" labelCol={{ span: 8 }} wrapperCol={{ span: 15 }}>
            {getFieldDecorator('permissionname', { initialValue: '' })(
              <Input readOnly={readOnlyORNot} style={{ width: '85%' }} placeholder="菜单名称" />
            )}
          </FormItem>

          <FormItem label="菜单/按钮(1/0)" labelCol={{ span: 8 }} wrapperCol={{ span: 15 }}>
            {getFieldDecorator('type', { initialValue: 1 })(
              <Input
                readOnly={readOnlyORNot}
                style={{ width: '85%' }}
                placeholder="菜单/按钮(1/0)"
              />
            )}
          </FormItem>

          <FormItem label="地址" labelCol={{ span: 8 }} wrapperCol={{ span: 15 }}>
            {getFieldDecorator('url', { initialValue: '' })(
              <Input readOnly={readOnlyORNot} style={{ width: '85%' }} placeholder="地址" />
            )}
          </FormItem>
        </Form>
      </Modal>
    );
  }

  componentDidMount() {}

  componentWillUnmount() {}
}

export default MenuAdd;
